require(['../config'], () => {
    require(['template', 'header', 'footer', 'zoom', 'fly'], (template) => {
        class Detail {
            constructor() {

                this.addToCart()
                this.render()


            }
            render() {
                    this.id = Number(window.location.search.slice(4))

                    $.get('http://rap2api.taobao.org/app/mock/241085/detail', { id: this.id }, resp => {
                        this.all = resp.body;
                        this.all = {...this.all, id: this.id }
                        var html = template('aaaaa', { list: resp })
                        $('#getshop').html(html)
                        this.arr = []
                        this.zoom()
                        this.addToCart()
                        this.amount()
                        this.nowTime()
                    })
                }
                //存数据
            localStorageSet() {
                    this.all = {...this.all, const: 1, check: true }
                    this.arr.push(this.all)
                    this.carts = JSON.parse(localStorage.getItem('carts'))
                    this.arr1 = []
                }
                //放大镜效果
            zoom() {
                    $('.food-img').elevateZoom({
                        gallery: 'gal1'
                    })
                }
                //数量点击事件
            amount() {
                $('#jia').on("click", function() {

                })
                let amountNum = 0;
                $('#jia').on("click", function() {
                    amountNum++
                    $('#num-val').val(amountNum);
                })
                $('#jian').on("click", function() {
                    amountNum--
                    if (amountNum < 1) {
                        amountNum = 0
                    }
                    $('#num-val').val(amountNum);
                })

            }

            //购物车点击事件
            addToCart() {
                if ($('#num-val').val() != 0) {
                    $('#btn2').on('click', (e) => {
                        this.fly(e)
                        this.localStorageSet()
                        if (this.carts) {
                            this.arr1 = this.carts
                                //判断数量lo有没有相同的数据
                            let boo = this.arr1.some(item => {
                                return item.id === this.all.id
                            })
                            if (boo) {
                                this.arr1 = this.arr1.map(item => {
                                    if (item.id === this.all.id) {
                                        item.const++
                                    }
                                    return item;
                                })
                            } else {
                                this.arr1.push(this.all)
                            }
                        } else {

                            this.arr1.push(this.all)
                            console.log(this.arr1)
                        }
                        localStorage.setItem('carts', JSON.stringify(this.arr1))
                    })
                }

            }

            //购物车抛物线
            fly(e) {
                $(`<img src="/images/bg1.jpg" style="width: 20px;height: 20px;border-radius:50%">`).fly({
                    start: {
                        left: e.clientX, //开始位置（必填）
                        top: e.clientY,
                    },
                    end: {
                        left: $('#cart').offset().left - $(window).scrollLeft(), //结束位置（必填）
                        top: $('#cart').offset().top - $(window).scrollTop() //结束位置（必填）
                    },
                    speed: 0.4,
                    vertex_Rtop: 100, //
                    onEnd: function() {
                            this.destroy()
                                // 重新调用一次header的方法，计算购物车数量
                                // header.calcCartCount()
                                // $(this).remove()
                        } //结束回调
                })
            }
            nowTime() {
                setInterval(function() {
                    var myDate = new Date;
                    var h = myDate.getHours(); //获取当前小时数(0-23)
                    var m = myDate.getMinutes(); //获取当前分钟数(0-59)
                    var s = myDate.getSeconds(); //获取当前秒
                    h = check(h);
                    m = check(m);
                    s = check(s);
                    $("#by").html(h + " : " + m + " : " + s);
                }, 1000)

                function check(i) {
                    //方法一，用三元运算符
                    var num;
                    i < 10 ? num = "0" + i : num = i;
                    return num;

                }
            }

        }
        new Detail()
    })
})